﻿@model TeamCityMonitor.Models.CustomModel
@{
    ViewBag.Title = "TeamCity Monitor";
}

<script type="text/javascript">

    var feedDelay = @ViewBag.FeedDelay;
    var scaleToWidth = @ViewBag.ScaleToWidth;

    var viewModel = ko.mapping.fromJS(@Html.Raw(Json.Encode(Model)));

    $(document).ready(function () {
        
        function loadCustomModel() {
            var url = "/Custom/GetCustomEntry/";
            $.ajax({
                url: url,
                success: function(response) {

                    if (response.success) 
                    {
                        ko.mapping.fromJS(response.result,viewModel);

                        $("#lastRefresh").text("Last Refresh : " + GetDateTime());
                        $("#fetchfailed").hide("slow");
                        $("#loading").remove();
                    } 
                    else 
                    {
                        ShowError(response.message);
                    }
                },
                error: function(reponse) {

                    ShowError(reponse);
                }
            });
        }
        
        function checkForRedirect() {
            var url = "/Custom/ShouldRedirect/";
            $.ajax({
                url: url,
                success: function(response) {

                    if (response.success) 
                    {
                        window.location = response.redirect;
                    } 
                }
            });
        }

        loadCustomModel();
        
        ko.applyBindings(viewModel);
        
        window.setInterval(function () { loadCustomModel(); }, feedDelay);
        
        window.setInterval(function () { checkForRedirect(); }, 2000);

        $(".customImage").animate({ width: scaleToWidth });
    });
    
    function GetDateTime () {
        var currentTime = new Date();
        var month = currentTime.getMonth() + 1;
        var day = currentTime.getDate();
        var year = currentTime.getFullYear();
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
        if (minutes < 10) {
            minutes = "0" + minutes;
        }
        return new String().concat(day, "/", month, "/", year, " ", hours, ":", minutes);
    }
    
    function ShowError(errorMessage) {

        $("#loading").remove();
        $("#fetchfailed").text("WARNING: Failed to retrieve projects ... " + errorMessage);
        $("#fetchfailed").show("slow");
    }
    
</script>

<div id="loading" class="loading">
    <img src="../../Content/ajax-loader.gif" alt="Loading..." />
</div>

<div class="customContainer">
    <div class="custom" >
        <div class="customRow">
            <div class="customContent">
                <h1 class="customTitle" data-bind="text: Title"></h1>
                
                <img class="customImage" data-bind='attr: { src: ImageUrl }' />
                <figcaption class="customImageCaption" data-bind="text: ImageCaption"></figcaption>

                <h2 class="customFooter" data-bind="text: Footer"></h2>
                <h3 class="customSignature" data-bind="text: Signature"></h3>
            </div>
        </div>
    </div>
</div>

<div id="foot">
    <h3 id="lastRefresh">
    </h3>
</div>




